define(["jquery"], function ($) {
	const slider = function (options) {
		let defaults = {
			speed: 600,
			delay: 3000,
			direction: true,
		};
		$.extend(defaults, options);

		let main = null,
			init = null,
			start = null,
			stop = null,
			next = null,
			prev = null,
			timer = null,
			indicators = null,
			elms = {};

		init = () => {
			elms.sliderElm = this.children(".slider");
			elms.btns = this.children(".btn");
			elms.sliderElm.append(elms.sliderElm.children(".slider-item").first().clone());
			elms.index = 1;
			elms.maxIndex = elms.sliderElm.children().length;
			elms.imgWidth = elms.sliderElm.children(".slider-item").first().width();

			let createIndicators = () => {
				let indicators = $("<div></div>");
				indicators.addClass("slider-indicators");
				for (let i = 0; i < elms.maxIndex - 1; i++) {
					let sliderBtn = $("<span></span>");
					sliderBtn.addClass("slider-indicators-btn");
					indicators.append(sliderBtn);
				}
				indicators.children().eq(0).addClass("active");
				this.append(indicators);
				indicators.children().on("click", function () {
					let index = indicators.children().index(this);
					elms.indicators.children().removeClass("active");
					$(this).addClass("active");
					elms.sliderElm.animate(
						{
							left: -(index * elms.imgWidth),
						},
						defaults.speed,
						() => {
							elms.index = ++index;
						}
					);
				});
				elms.indicators = indicators;
			};

			this.hover(
				function () {
					stop();
				},
				function () {
					timer = setInterval(start.bind(null, defaults.direction), defaults.speed + defaults.delay);
				}
			);

			function ttottle(wait, callback) {
				let prev = 0;
				return function () {
					let now = Date.now();
					if (now - prev >= wait) {
						prev = now;
						callback.call(this, ...arguments);
					}
				};
			}
			next = () => {
				stop();
				start(1);
			};
			prev = () => {
				stop();
				start(0);
			};
			elms.btns.on(
				"click",
				ttottle(defaults.speed, function () {
					if (elms.btns.index(this)) {
						next();
					} else {
						prev();
					}
				})
			);
			createIndicators();
		};
		indicators = (direction) => {
			elms.indicators.children().removeClass("active");
			if (direction) {
				if (elms.index == elms.maxIndex - 1) {
					elms.indicators.children().first().addClass("active");
				} else {
					elms.indicators.children().eq(elms.index).addClass("active");
				}
			} else {
				if (elms.index == 1) {
					elms.indicators.children().last().addClass("active");
				} else {
					elms.indicators
						.children()
						.eq(elms.index - 2)
						.addClass("active");
				}
			}
		};
		start = function (direction) {
			indicators(direction);
			let left = `-=${elms.imgWidth}`;
			if (!direction) {
				left = `+=${elms.imgWidth}`;
				if (elms.index == 1) {
					let left = -((elms.maxIndex - 1) * elms.imgWidth);
					elms.sliderElm.css("left", `${left}px`);
					elms.index = elms.maxIndex;
				}
			}
			elms.sliderElm.animate(
				{
					left,
				},
				defaults.speed,
				function () {
					direction ? elms.index++ : elms.index--;
					if (elms.index == elms.maxIndex) {
						elms.index = 1;
						elms.sliderElm.css("left", 0);
					}
				}
			);
		}.bind(this);
		stop = () => {
			clearInterval(timer);
			elms.sliderElm.stop(true, true);
		};
		main = () => {
			init();
			timer = setInterval(start.bind(null, defaults.direction), defaults.speed + defaults.delay);
		};
		main();
	};
	return {
		slider,
	};
});
